<template>
  <el-dialog v-if="load" :title="title" v-model="visible" append-to-body :close-on-click-modal="false" class="full" :z-index="2000" width="1240px" @close="handleClose">
    <VTable v-if="tables.length === 1" v-bind="tables[0]"></VTable>
    <el-tabs v-else v-model="activeName">
      <el-tab-pane v-for="d in tables" :key="d.name" :label="d.title" :name="d.name" style="height: calc(98vh - 186px)">
        <VTable v-if="[3, 6].includes(activeName)" v-bind="d">
          <template #form="{ form }">
            <VSelect v-model="form.warehouse_id" placeholder="收货仓库" :options="options.warehouse" multiple collapse-tags style="min-width: 160px" />
          </template>
        </VTable>
        <VTable v-else v-bind="d" />
      </el-tab-pane>
    </el-tabs>
    <template #footer>
      <el-button @click="close">关 闭</el-button>
    </template>
    <Lock ref="lockRef" />
  </el-dialog>
</template>

<script setup lang="jsx">
import request from "@/utils/request"
import { to } from "@/utils/action"
import Lock from "./Lock"

const props = defineProps({
  options: { type: Object, default: () => ({}) },
  sale: Boolean,
})

const load = ref(false)
const visible = ref(false)
const activeName = ref(2)
const lockRef = ref()
const type = inject("type")
const path = props.sale ? "list-intelligent-stock" : "intelligent-stock"

const toWMS = (row) => {
  close()
  sessionStorage.setItem("_table_form", JSON.stringify({ tableForm: { skuRange: { type: "sku", value: [row.sku] } } }))
  to({ path: "/wms/overseasWarehouse/warehousePlatform" })
}
const toTC = (row) => {
  close()
  const paths = { path: `/head_procedure/orderManagement/warehouseList/detail`, query: { order_no: row.backup_warehouse_order_no } }
  to(paths)
}

const configs = {
  1: {
    name: 1,
    title: "本地仓可用",
    columns: [
      { title: "仓库类型", field: "wms_attribute_name" },
      { title: "仓库名称", field: "warehouse_name" },
      { title: "待入库", field: "transit_num" },
      { title: "可用库存", field: "num" },
      { visible: type === 3, title: "运营人员", field: "sale_name" },
    ],
    query: (data) => request({ baseURL: window.APP_GETEWAY.pms, url: `/v1/purchase-demand/${path}/get-stock`, method: "post", data }),
  },
  2: {
    name: 2,
    title: "海外仓可用",
    columns: [
      { title: "仓库类型", field: "wms_attribute_name" },
      { title: "仓库名称", field: "warehouse_name" },
      { title: "待入库", field: "transit_num" },
      { title: "可用库存", field: "num" },
      { visible: type === 3, title: "运营人员", field: "sale_name" },
      {
        title: "已锁定库存",
        field: "lock_num",
        slots: {
          default: ({ row }) => <VText value={row.lock_num} type={row.lock_num ? "button" : ""} onClick={() => lockRef?.value.open(row)} />,
        },
      },
    ],
    query: (data) => request({ baseURL: window.APP_GETEWAY.pms, url: `/v1/purchase-demand/${path}/get-stock`, method: "post", data }),
  },
  3: {
    name: 3,
    title: "海外仓在途",
    columns: [
      {
        title: "备货单号",
        field: "backup_warehouse_order_no",
        width: 180,
        slots: {
          default: ({ row }) => <VText value={row.backup_warehouse_order_no} type="link" line={2} onClick={() => toTC(row)} />,
        },
      },
      { title: "状态", field: "status", width: 70 },
      {
        title: "sku",
        field: "sku",
        width: 80,
        slots: {
          default: ({ row }) => (
            <div>
              <VText value={row.sku} />
              <VText value="库龄查看" type="link" onClick={() => toWMS(row)} />
            </div>
          ),
        },
      },
      { title: "发货仓库", field: "out_warehouse_name", width: 90 },
      {
        field: "tracking_cost",
        width: 100,
        slots: {
          header: () => (
            <div>
              加权运费
              <br />
              加权采购成本
            </div>
          ),
          default: ({ row }) => (
            <div>
              <VText value={row.tracking_cost} />
              <VText value={row.weighted_cost} />
            </div>
          ),
        },
      },
      { title: "运输方式", field: "shipping_type", width: 74 },
      {
        field: "send_num",
        width: 74,
        slots: {
          header: () => (
            <div>
              发货数量
              <br />
              收货数量
            </div>
          ),
          default: ({ row }) => (
            <div>
              <VText value={row.send_num} />
              <VText value={row.get_goods_num} />
            </div>
          ),
        },
      },
      { title: "剩余收货数量", field: "end_num", width: 70 },
      { title: "收货仓库", field: "in_warehouse_name" },
      {
        field: "outstock_join_time",
        slots: {
          header: () => (
            <div>
              发货时间
              <br />
              收货时间
            </div>
          ),
          default: ({ row }) => (
            <div>
              <VText value={row.outstock_join_time} />
              <VText value={row.get_goods_time} />
            </div>
          ),
        },
      },
      { title: "预计到货时间", field: "eta_date" },
      { visible: type === 3, title: "运营人员", field: "sale_name" },
    ],
    query: (data) => request({ baseURL: window.APP_GETEWAY.pms, url: `/v1/purchase-demand/${path}/get-oversea-transit`, method: "post", data }),
  },
  6: {
    name: 6,
    title: "海外仓完结",
    columns: [
      {
        title: "备货单号",
        field: "backup_warehouse_order_no",
        width: 180,
        slots: {
          default: ({ row }) => <VText value={row.backup_warehouse_order_no} type="link" line={2} onClick={() => toTC(row)} />,
        },
      },
      { title: "状态", field: "status", width: 70 },
      {
        title: "sku",
        field: "sku",
        width: 80,
        slots: {
          default: ({ row }) => (
            <div>
              <VText value={row.sku} />
              <VText value="库龄查看" type="link" onClick={() => toWMS(row)} />
            </div>
          ),
        },
      },
      { title: "发货仓库", field: "out_warehouse_name", width: 90 },
      {
        field: "tracking_cost",
        width: 100,
        slots: {
          header: () => (
            <div>
              加权运费
              <br />
              加权采购成本
            </div>
          ),
          default: ({ row }) => (
            <div>
              <VText value={row.tracking_cost} />
              <VText value={row.weighted_cost} />
            </div>
          ),
        },
      },
      { title: "运输方式", field: "shipping_type", width: 74 },
      {
        field: "send_num",
        width: 74,
        slots: {
          header: () => (
            <div>
              发货数量
              <br />
              收货数量
            </div>
          ),
          default: ({ row }) => (
            <div>
              <VText value={row.send_num} />
              <VText value={row.get_goods_num} />
            </div>
          ),
        },
      },
      { title: "剩余收货数量", field: "end_num" },
      { title: "收货仓库", field: "in_warehouse_name" },
      {
        field: "outstock_join_time",
        slots: {
          header: () => (
            <div>
              发货时间
              <br />
              收货时间
            </div>
          ),
          default: ({ row }) => (
            <div>
              <VText value={row.outstock_join_time} />
              <VText value={row.get_goods_time} />
            </div>
          ),
        },
      },
      { title: "预计到货时间", field: "eta_date" },
      { visible: type === 3, title: "运营人员", field: "sale_name" },
    ],
    query: (data) => request({ baseURL: window.APP_GETEWAY.pms, url: `/v1/purchase-demand/${path}/get-oversea-complete`, method: "post", data }),
  },
  4: {
    name: 4,
    title: "采购在途",
    columns: [
      { title: "采购单号", field: "purchase_no", width: 140 },
      { title: "状态", field: "audit_status_name" },
      { title: "国家", field: "country_name" },
      { title: "sku", field: "sku" },
      { title: "自定义sku", field: "custom_sku" },
      {
        title: "销售人员",
        field: "sale_name",
        slots: {
          default: ({ row }) => <VText value={(row.sale || []).map((d) => `${d.sale_name}${d.purchase_num}`).join(";")} line={2} />,
        },
      },
      { title: "供应商代码", field: "supplier_code" },
      { title: "收货仓库", field: "destination_warehouse_name" },
      { title: "采购数量", field: "purchase_num", width: 80 },
      { title: "未到货数量", field: "un_inbound_num" },
      { title: "下单时间", field: "create_time" },
      { title: "预计到货时间", field: "expect_delivery_time", width: 110 },
      { title: "目的仓", field: "warehouse_name" },
    ],
    query: (data) => request({ baseURL: window.APP_GETEWAY.pms, url: `/v1/purchase-demand/${path}/get-purchase-transit`, method: "post", data }),
  },
  5: {
    name: 5,
    title: "未配货预出数",
    columns: [
      { title: "订单号", field: "order_sn" },
      { title: "状态", field: "order_status_desc" },
      { title: "sku", field: "sku" },
      { title: "国家", field: "country_name" },
      { title: "仓库", field: "ship_warehouse_name" },
      { title: "运输方式", field: "shipping_method" },
      { title: "发货数量", field: "quantity" },
      { title: "发货时间", field: "shipping_time" },
      { title: "订单备注", field: "order_remark" },
      { visible: type === 3, title: "运营人员", field: "sale_name" },
    ],
    query: (data) => request({ baseURL: window.APP_GETEWAY.pms, url: `/v1/purchase-demand/${path}/get-order-delivery`, method: "post", data }),
  },
  7: {
    name: 7,
    title: "待下PO",
    columns: [
      { title: "PR单号", field: "demand_no" },
      { title: "状态", field: "sku_purchase_status_name" },
      { title: "sku", field: "sku", width: 80 },
      { title: "需求ID", field: "sku_no" },
      { title: "自定义SKU", field: "custom_sku" },
      { title: "销售人员", field: "sale_name", width: 90 },
      { title: "需求数量", field: "demand_num", width: 80 },
      { title: "待下单数量", field: "wait_order_num", width: 90 },
      { title: "需求时间", field: "demand_time", width: 100 },
      { title: "申请时间", field: "demand_create_time" },
      { title: "目的仓", field: "warehouse_name" },
    ],
    query: (data) => request({ baseURL: window.APP_GETEWAY.pms, url: `/v1/purchase-demand/${path}/get-wait-purchase`, method: "post", data }),
  },
  8: {
    name: 8,
    title: "本地仓待发",
    columns: [
      { title: "头程单号", field: "backup_warehouse_order_no" },
      { title: "状态", field: "status" },
      { title: "sku", field: "sku", width: 80 },
      { title: "国家", field: "country_name" },
      { visible: type === 3, title: "销售人员", field: "sale_name", width: 90 },
      { title: "锁定数量", field: "send_num", width: 80 },
      { title: "发货仓", field: "out_warehouse_name" },
      { title: "目的仓", field: "warehouse_name" },
      { title: "计划发货时间", field: "deliver_goods_time" },
    ],
    query: (data) => request({ baseURL: window.APP_GETEWAY.pms, url: `/v1/purchase-demand/${path}/get-oversea-transit`, method: "post", data }),
  },
  9: {
    name: 9,
    title: "其他在途",
    columns: [
      { title: "来源单号", field: "order_no" },
      { title: "类型", field: "op_type_cn" },
      { title: "状态", field: "status_cn", width: 100 },
      { title: "sku", field: "sku", width: 100 },
      { title: "发货仓库", field: "out_warehouse_name" },
      { title: "计划数量", field: "plan_num", width: 100 },
      { title: "在途数量", field: "transit_num", width: 100 },
      { title: "收货仓库", field: "in_warehouse_name" },
    ],
    query: (data) => request({ baseURL: window.APP_GETEWAY.pms, url: `/v1/purchase-demand/${path}/get-oversea-other-transit`, method: "post", data }),
  },
}

const title = ref("")
const tables = ref([])
const optionConfig = {
  border: true,
  autoResize: true,
  height: "auto",
  columnConfig: {
    resizable: true,
  },
  // formConfig: {
  //   data: {
  //     warehouse_id: ''
  //   }
  // },
  rowClassName: ({ row }) => (row.is_red ? "bg-error" : ""),
  pagerConfig: {
    enabled: true,
    pageSize: 20,
  },
}

// 打开弹窗
const open = async (types, row, { str = "", is_send = 1 } = {}) => {
  if (!load.value) {
    load.value = true
    await 1
  }
  if (!Array.isArray(types)) {
    types = [types]
  }
  types.forEach((ty) => {
    const config = configs[ty]
    const { sku, country, warehouse_id, sale_id } = row
    const params = { sku: [sku], warehouse_attr: ty, pageSize: 20, pageNum: 1, type, warehouse_id: warehouse_id ? [warehouse_id] : [], sale_id: sale_id ? [sale_id] : [], is_send }
    if (ty !== 1) {
      params.country = [country]
    }
    const tableOptions = Object.assign({}, optionConfig, config, {
      proxyConfig: { ajax: { query: ({ form, page }) => config.query({ ...params, ...page, ...form }) }, props: { result: "data", total: "total" } },
    })
    tables.value.push(tableOptions)
  })
  activeName.value = tables.value[0].name
  title.value = str || tables.value[0].title

  visible.value = true
}
// 关闭弹窗
const close = () => {
  visible.value = false
}

const handleClose = () => {
  tables.value = []
}

defineExpose({ open })
</script>
